<!-- 弹窗 详情 -->
<script lang="tsx" setup>
import { ref } from "vue";
import bus from "vue3-eventbus";
defineOptions({ name: 'Waring' });
// const dialogRef = shallowRef<InstanceType<GlobalComponents['PromiseDialog']>>();
let waringcontent = ref('')
let isShow = ref(false)
bus.on('waring',(val:any) => {
  isShow.value = true
  console.log(val)
  waringcontent.value = val.waringContent
})
</script>

<template>
  <div class="container" v-show="isShow">
    <el-descriptions title="预警提醒">
      <el-descriptions-item>
        <div class="content">{{waringcontent}}</div>
      </el-descriptions-item>
    </el-descriptions>
    <div class="close" @click="isShow = !isShow">x</div>
  </div>
</template>
<style scoped>
.container{
  position: absolute;
  z-index: 3;
  display: flex;
  top: 364px;
  left: 600px;
  width: 707px;
  height: 314px;
  background: #FFFFFF;
  /* box-shadow: 0px 4px 10px 0px rgba(0,0,0,0.1); */
  border-radius: 2px;
  border: 1px solid #E5E6EB;
  padding: 31px;
  }
.content{
  width: 644px;
  height: 174px;
  background: #FFFFFF;
  border-radius: 2px;
  border: 1px solid #D9D9D9;
}
.close{
  width: 14px;
  height: 14px;
  font-size: larger;
  cursor: pointer;
  /* background: #272636; */
}
</style>
